<!DOCTYPE html>
<html lang="zh">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>002</title>

    

</head>
<body>
    <input type="button" value="btn" onclick="console.log(111);" >

    <script>
        // 以兼容的方式构建 异步请求对象 xhr
        function createXHR() {
            // 现在基本不需要做兼容的处理
            var xhr;
            if(window.XMLHttpRequest){
                // Mozilla, Safari, Chrome, IE7+, ...
                xhr = new XMLHttpRequest();
            } else if(window.ActiveXObject) {
                // IE6 or older
                xhr = new ActiveXObject("Microsoft.XMLHTTP");
            } else {
                alert("您的浏览器不支持Ajax请求");
            }
            return xhr;
        }

        // 创建xhr对象
        var xhr = createXHR();
        // 建立与服务器的连接
        // 请求的方式(HTTP请求方式), 例如: GET、POST、PUT、DELETE 等。
        var method = "post";
        // 请求发送的地址, 处理请求的地址。表示要向其发送请求。
        var url = "http://localhost/ajax/service/ajax01.php";
        // 一个布尔类型的值, 默认为true, 表示异步执行操作, 即发送异步的请求;
        // 如果为false, 则表示发送同步的请求。
        var async = true;
        xhr.open(method, url, async);

        // 一般使用post方式发送请求并携带数据时, 需要设置请求头
        // 如果使用普通表单形式传递参数, 设置如下:
        xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");

        console.log("====before");
        // 参数格式必须是 query parameter 格式 即 "参数名=值&参数名=值&...."
        var params = "name=jerry&age=24&address=nanjing";
        // params = "";
        xhr.send(params);
        console.log("====end");




    </script>
</body>
</html>